<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <title>Title</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <script src="${pageContext.request.contextPath}/js/jquery-2.1.0.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

</head>
<body>
<div class="container" style="margin-top: 10px">
    <form class="form-horizontal" id="form2004">
        <div class="form-group">
            <label for="id" class="col-sm-2 control-label">id</label>
            <div class="col-sm-10">
                <input id="id" class="form-control"  name="id" readonly >
            </div>
        </div>
        <div class="form-group">
            <label for="username" class="col-sm-2 control-label">username</label>
            <div class="col-sm-10">
                <input type="text" id="username" class="form-control" name="username" placeholder="用户名" >
            </div>
        </div>
        <div class="form-group">
            <label  class="col-sm-2 control-label">性别</label>
            <div class="col-sm-10">
                <c:if test="${user.gender}">
                    <input type="radio"   name="gender" value="true" checked> 男
                    <input type="radio"   name="gender" value="false"> 女
                </c:if>
                <c:if test="${!user.gender}">
                    <input type="radio"   name="gender" value="true" > 男
                    <input type="radio"   name="gender" value="false" checked> 女
                </c:if>

            </div>
        </div>
<%--        <div class="form-group">--%>
<%--            <label for="birth" class="col-sm-2 control-label">注册时间</label>--%>
<%--            <div class="col-sm-10">--%>
<%--                <input id="birth" class="form-control" name="birth" placeholder="生日" type="date"--%>
<%--                       value="<fmt:formatDate value="registTime" pattern="yyyy/MM/dd"/>"/>--%>
<%--            </div>--%>
<%--        </div>--%>
        <div class="form-group">
            <label for="registTime" class="col-sm-2 control-label">注册时间</label>
            <div class="col-sm-10">
                <input  class="form-control" id="registTime" placeholder="registTime" name="registTime" />
            </div>
        </div>

        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="button" class="btn btn-default" onclick="insertUser()">添加</button>
            </div>
        </div>
    </form>
</div>
<script>

    $.fn.serializeObject = function() {
        var o = {};
        var a = this.serializeArray();
        $.each(a, function() {
            if (o[this.name]) {
                if (!o[this.name].push) {
                    o[this.name] = [ o[this.name] ];
                }
                o[this.name].push(this.value || '');
            } else {
                o[this.name] = this.value || '';
            }
        });
        return o;
    };

    function insertUser(){
        // 获取form参数
        // {id: "4", username: "冯一帆2004", gender: "true", birth: "2020/06/29"}
        var params = $("#form2004").serializeObject();
        $.ajax({
            url:"${pageContext.request.contextPath}/insertUser",
            type:"post",
            data:JSON.stringify(params),
            contentType:"application/json",
            success:function(ret){
                if(ret.status=="ok"){
                    alert("添加成功")
                }else{
                    alert("添加失败")
                }
                // 访问查询所有
                location.href="${pageContext.request.contextPath}/users";
            }
        });
    }
</script>
</body>
</html>
